//colors
$white: #fff;
$color_lochmara_approx: #0088cc;
$color_gallery_approx: #eeeeee;
//@extend-elements
//original selectors
//ul.nav-tabsn li.active a, ul.nav-tabs li.active a:hover
%extend_1 {
  color: $white;
  background: $color_lochmara_approx;
  border: 1px solid $color_lochmara_approx;
}

ul {
  &.nav-tabsn li.active a {
    @extend %extend_1;
  }
  &.nav-tabs li.active a:hover {
    @extend %extend_1;
  }
}

.site_title_css {
  line-height: 70px;
  font-size: 30px;
  padding-left: 50px;
  background-color: $color_gallery_approx;
  height: 70px;
  margin-bottom: 15px;
}

.nav_extent {
  padding: 3px 5px;
}


/* show 页面 */

.show {
  .content_title_type {
    border-radius: 5px;
    border: solid 1px red;
    padding: 2px 16px;
  }

  .content_title_item {
    margin-right: 10px;
    margin-left: 10%;
    width: 200px;
  }

  .content_title_procon {
    border-radius: 5px;
    border: solid 1px #bbbbbb;
    padding: 2px 16px;
    float: right;
    width: 80px;
    cursor: pointer;
  }

  span.content_title_procon.unlock:hover {
    background-color: #FFE4C4;
  }

  .lock {
    background-color: #bbbbbb;
  }

  .add-comment {
    button {
      margin-top: 5px;
    }
  }

  span.title-content {
    background-color: #ceecc2;
    padding: 3px 5px;
    border-radius: 3px;
  }

  span.title-content:hover {
    background-color: #9bec7a;
  }

  .bottom-title-content {
    border-bottom: solid 1px #ccc;
    padding-bottom: 12px;
  }

  .comment-operation {
    .list-inline {
      margin-top: 5px;
      margin-bottom: 4px;
    }

    .operation {
      cursor: pointer;

      border: solid 1px #ccc;
      border-radius: 3px;
      padding: 4px;

      .num {
        margin-left: 3px;
      }

      &:hover {
        background-color: #ccc;
      }
    }
  }

  .comment-text {
    padding: 5px;
    border: solid 1px #ddd;
    background-color: #eee;
  }

  .clear-up {
    display: block;
  }
}

/* index,index-new */
.index,
.index-new {
  .frend-links {
    width: 100%;
    background-color: #fefefe;
    padding: 3px 10px;

    ul {
      list-style: none;
      margin: 0;

      li:first-child {
        border: 0;
      }

      li {
        border: dashed 1px #ccc;
        width: initial;
      }
    }
  }
}

/* index 页面 */
.sign-in,
.index {
  .MainContent {
    .myTitle,
    .NaviWindow .myTitle,
    .ContWindow .myTitle {
      margin: 0 auto;
      height: 45px;
      line-height: 45px;
      background-color: #A2BEFF;
      text-align: center;
      font-weight: bolder;
      color: #ffffff;
      font-size: larger;
      overflow: hidden;
    }
  }

  .MainContent {
    margin: 10px auto;
    width: 1200px;
    background-color: #E2E1DA;
    overflow: hidden;

    .NaviWindow {
      a {
        display: block;
        margin-left: 5px;
        width: 280px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
      display: inline-block;
      padding: 10px;
      margin: 10px;
      width: 330px;
      background-color: #b0e0e6;
      text-align: left;
      height: 550px;
      overflow: auto;
      float: left;
      overflow: hidden
    }

    .ContWindow {
      display: inline-block;
      padding: 10px;
      margin: 10px;
      left: 240px;
      width: 820px;
      height: 550px;
      background-color: #fff4ff;
    }
  }
}
/* signin */
.sign-in {
  .MainContent {
    .ContWindow {
      margin: 20px auto;
      display: block;
    }
  }
}

.admin {
  .left {
    text-align: left;
  }

  .table-custom {
    table-layout: fixed;
    td {
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis;
    }

    .td-50 {
      width: 50px;
    }

    .td-100 {
      width: 100px;
    }

    .td-150 {
      width: 150px;
    }

    .td-200 {
      width: 200px;
    }

    .td-250 {
      width: 250px;
    }

    .td-300 {
      width: 300px;
    }

    .td-tiny,
    .td-min,
    .td-middle,
    .td-large {
      word-break: break-all;


      &.left {
        text-align: left;
      }

      &.right {
        text-align: right;
      }

      &.center {
        text-align: center;
      }
    }
  }
}

.index-new {
  span.link-list {
    border-radius: 4px;
    border:solid 1px #666;
    padding: 0 10px;
  }

  span.language {
    background-color: #ccc;
    padding: 2px 4px;
    margin-left: 3px;
    border-radius: 3px;
  }
}

.sub-text {
  color: #ccc;
}